<style scoped>
	#postid{
		padding-bottom:150px;
	}
	.article-title{
		text-align:center;
		font-size:1.625rem;
		line-height:2rem;
		color:#6a6a6a;
	}
	.article-info {
		text-align: center;
		margin-top:20px;
		font-size:12px;
		color:#999;
	}
	.article-info > span:nth-of-type(1){
		margin-right:5px;
	}
	.article-info > i:nth-of-type(2){
		margin-left:5px;
	}
	.article-body{
		margin-top:30px;
	}

	.foot{
		margin-top:50px;
		padding-left:10px;
		background-color:#f0f0f0;
		padding-top:20px;
		padding-bottom:20px;
		border-left:2px solid #ff1700;
	}
</style>
<style>

</style>

<template>
	<div id='postid'>
		<div class='article-container' v-for='item in article' :key='item.id'>
			<article>
				<h1 class='article-title' v-text='item.title'></h1>
				<div class='article-info'>
					<i class='iconfont'>&#xe660;</i>
					 发表于 
					<span v-text='item.publishTime'></span>
					  |  
					<i class='iconfont'>&#xe60b;</i>
					 阅读数 
					<span v-text='item.readingAmount'></span>
				</div>
				<div class='article-body markdown-body' v-html='item.html'></div>
			</article>
			<support></support>
		</div>
		<div class='foot'>
			<p>作者：Joey Wong (自己取的英文名😊)</p>
			<p>声明：转载请注明出处</p>
		</div>
	</div>
</template>


<script>
import support from '@/components/Support'
export default {
        name: 'Postid',
        data () {
            return {
				article:[]
            }
        },
        mounted() {
			const that = this;
            this.$http.get(
            	that.surl+that.$route.path
            )
              .then(function (response) {
              	if(response.data!==false){
				  that.article = response.data;
				  document.title="Joey Wong's Blog-"+that.article[0].title;
              	}else{
              		that.$router.push('/404');
              	}
              })
              .catch(function (error) {
				that.$router.push('/404');
              });
        },
        components: {
	    	support
		}
    }
</script>